<html>
    <head>
        <title>Login to Cassiopeia</title>
        <meta name="layout" content="main-layout"></meta>
        <link rel="stylesheet" href="${resource(dir:'css',file:'login.css')}"></link>
        <script type='text/javascript'>
            var activePage = "login";
        </script>
    </head>

    <body>
        <div id="login-wrapper">
            <form action='${postUrl}' method='POST' id='loginForm' class='login_form' autocomplete='off'>
                <g:if test='${flash.message}'>
                    <div class='message' id="login-message">${flash.message}</div>
                </g:if>
                <p>
                    <label for='username'>Username:</label>
                    <input type='text' name='j_username' id='username' class="big_text_area" />
                </p>
                <p>
                    <label for='password'>Password:</label>
                    <input type='password' name='j_password' id='password' class="big_text_area" />
                </p>

                <p><input type='submit' value='Login' class="login_button" /></p>
            </form>
        </div>

        <script type='text/javascript'>
        (function(){
          document.forms['loginForm'].elements['j_username'].focus();
        })();
        </script>
    </body>
</html>
